<template>
  <div>
    <tool-bar nav="" title='Http请求'></tool-bar>
    <kv label="文本">
      <el-input type="textarea" v-model="$data.txt1" :rows="12"></el-input>
    </kv>

    <kv label="转换">
      <el-button @click="exec_click">执行curl⤵</el-button>

      <el-button @click="to_http_click">⤷转为HttpClient⤵</el-button>
    </kv>

    <kv label="结果">
      <el-input type="textarea" v-model="$data.txt2" :rows="16"></el-input>
    </kv>

  </div>
</template>
<script setup>
/**
 * Created by CodeGenerator
 */


defineOptions({
  name: "query-json",
  inheritAttrs: true,
});

//定义 vue2的this,当前组件
const $self = getCurrentInstance();

//定义 $attrs
const $attrs = useAttrs();


//定义data
const $data = reactive({"txt1": "", "txt2": ""});


const $props = defineProps({});


const list = ref();

//定义事件
const $emit = defineEmits(["update:modelValue", "loaded"]);


const exec_click = function () {
  $data.txt2 = "";
  jv.$saveData("txt1", $data.txt1);

  jv.$http.post("/sys/exec-curl", $data.txt1, {headers: {"Content-Type": "text/plain"}}).then(res => {
    $data.txt2 = res.request.responseText
  })
};

const to_http_click = function () {
  $data.txt2 = "";
  jv.$saveData("txt1", $data.txt1);

  var lines = $data.txt1.split("\n").filter(it => it);

  var http1 = [];
  var http2 = [];
  var method = "";


  var urlLine = lines.find(it => it.includes("⤷"));
  if (urlLine) {
    if (urlLine.includes(" POST ")) {
      method = "POST";
    } else if (urlLine.includes(" PUT ")) {
      method = "PUT";
    } else if (urlLine.includes(" DELETE ")) {
      method = "DELETE";
    } else if (urlLine.includes(" PATCH ")) {
      method = "PATCH";
    } else {
      method = "GET";
    }


    if (urlLine.includes("⟼")) {
      //⤷ 500 Bearer cegrohjf785c0 10.42.0.1 POST /farmsAlthough/bestow? ⟼  http://test.huatuocloud.com/api/app-api/basicData/add
      var sect = urlLine.split("⟼");

      http1.push(method + " " + sect[0].trim().split(" ").getLast());
      http2.push(method + " " + sect[1].trim());
    } else {
      //⤷ null 10.42.0.1 POST http://test.huatuocloud.com/callBackRisk/productListResult
      var url = urlLine.split(" ").getLast();
      http1.push(method + " " + url);
    }
  }


  if (!http1.length) {
    $data.txt2 = "解析失败! 需要格式:  ⤷⤵ ✰ ";
    return;
  }


  var headerLine = lines.find(it => it.startsWith("⤵"));
  if (headerLine) {
    var header = JSON.parse(headerLine.slice("⤵".length));

    http1.push( Object.keys(header).map(it => it + ": " + header[it]).join("\n") )
  }


  headerLine = lines.find(it => it.startsWith("↦   api请求头:"));
  if (headerLine) {
    var header = JSON.parse(headerLine.slice("↦   api请求头:".length))

    http2.push( Object.keys(header).map(it => it + ": " + header[it]).join("\n") )
  }


  var postLine = lines.find(it => it.startsWith("✰"));
  if( postLine ){
    http1.push("")
     http1.push( postLine.slice("✰".length).trim())
  }


  var postLine = lines.find(it => it.startsWith("↦   api请求体:"));
  if (postLine) {
    http2.push("")
    http2.push(postLine.slice("↦   api请求体:".length).trim())
  }

  $data.txt2 = `### 请求1
${http1.join("\n")}


### 请求2
${http2.join("\n")}
`
};


onMounted(function () {
  jv.$loadData("txt1", v => $data.txt1 = v);
});

</script>

<style lang="scss" scoped>
::v-deep(.kv>.k) {
  flex: 1;
}

::v-deep(.kv>.v>:first-child) {
  max-width: unset;
}

.grid {
  position: relative;
  margin-left: 20px !important;
  margin-top: 20px !important;


  ::v-deep(textarea), ::v-deep(.el-col), ::v-deep(.el-textarea) {
    height: 100%;
  }
}

.op_column {
  padding-top: 150px;
  padding-bottom: 150px;
  display: flex;
  flex-wrap: wrap;
  place-content: center;
  align-content: space-around;
  position: relative;
  height: 100%;


  button {
    display: block;
    margin: 10px 6px;
  }

}
</style>